<template>
	<view class="container">
		<u-navbar title="签到积分"></u-navbar>
		<view class="pad-base">
			<unicloud-db ref="udb" v-slot:default="{data, pagination, loading, hasMore, error}"
				:collection="collectionList" field="uid,type,note,createTime,balance,income,storeId{name}" :where="where" orderby="createTime desc">
				<view v-if="error">{{error.message}}</view>
				<view v-else-if="data">
					<uni-list>
						<uni-list-item v-for="(item, index) in data" :key="index" :showArrow="false"
							@click="handleItemClick()">
							<view class="h-box">
								<view class="flex-v flex-extend">
									<text class="text-title">
										{{item.note || '-'}}
									</text>
									<text>
										门店：{{item.storeId.length ? item.storeId[0].name : '-'}}
									</text>
									<uni-dateformat :threshold="[0, 0]" :date="item.createTime"></uni-dateformat>
								</view>
								<text class="text-income">{{item.income > 0 ? '+' + item.income : item.income}}</text>
							</view>
						</uni-list-item>
					</uni-list>
				</view>
				<uni-load-more :status="loading?'loading':(hasMore ? 'more' : 'noMore')"></uni-load-more>
			</unicloud-db>
		</view>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex'
	const db = uniCloud.database()
	export default {
		data() {
			return {
				collectionList: "t3ds-integral-log,t3ds-store",
			}
		},
		onShow() {
			if (this.needReload) {
				this.needReload = false
				this.reload()
			}
		},
		computed: {
			...mapState(['userInfo']),
			where() {
				return `uid=='${this.userInfo._id}'`
			}
		},
		onPullDownRefresh() {
			this.$refs.udb.loadData({
				clear: true
			}, () => {
				uni.stopPullDownRefresh()
			})
		},
		onReachBottom() {
			this.$refs.udb.loadMore()
		},
		methods: {
			handleItemClick(id) {
				
			}
		}
	}
</script>

<style>
	page {
		color: #000;
	}
</style>
<style lang="scss" scope>
	.uni-list {
		border-radius: 20rpx;
	}
	.text-income {
		color: #FE5C47;
		font-size: 36rpx;
		font-weight: 600;
	}
</style>